<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Restaurant Home Page</title>
        <meta name="description" content="Handbag" />
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
        <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
        <link rel="stylesheet" href="css/layout.css" type="text/css"/>
        <link rel="stylesheet" href="css/ws_container.css" type="text/css"/>
        <link rel="stylesheet" href="css/ws_news.css" type="text/css"/>

        <!-- HOT LINE -->
        <link rel="stylesheet" href="../../widget/hotline/0/hotline_0.css" type="text/css"/>
        <!-- LOGO -->
        <link rel="stylesheet" href="../../widget/logo/3/logo_3.css" type="text/css" />
        <!-- SEARCH -->
        <link rel="stylesheet" href="../../widget/search_bar/3/search_bar_3.css" type="text/css" />
        <!-- HMENU -->
        <link rel="stylesheet" href="../../widget/hmenu/4/hmenu_4.css" type="text/css" />
        <!-- BREADCRUMBS -->
        <link rel="stylesheet" href="../../widget/breadcrumbs/1/breadcrumbs_1.css" type="text/css" />
        <!-- HTML BLOCK 1 -->
        <link rel="stylesheet" href="../../widget/html_block/1/html_1.css" type="text/css" />
        <!-- TEXT LIST 1 -->
        <link rel="stylesheet" href="../../widget/text_list/1/text_list_1.css" type="text/css" />
        <!-- Social 8 -->
        <link rel="stylesheet" href="../../widget/social_network/8/social_8.css" type="text/css" />
        <!-- HTML BLOCK 8 -->
        <link rel="stylesheet" href="../../widget/html_block/8/html_8.css" type="text/css" />
        <!-- HTML BLOCK 9 -->
        <link rel="stylesheet" href="../../widget/html_block/9/html_9.css" type="text/css" />
        <!-- HTML BLOCK 2 -->
        <link rel="stylesheet" href="../../widget/html_block/2/html_2.css" type="text/css" />
        <!-- NEWS FILTER 11 -->
        <link rel="stylesheet" href="../../widget/news_filter/11/news_filter_11.css" type="text/css" />
         <!-- VMENU 1 -->
        <link rel="stylesheet" href="../../widget/vmenu/1/vmenu_1.css" type="text/css" />  
        <!-- VMENU 2 -->
        <link rel="stylesheet" href="../../widget/vmenu/2/vmenu_2.css" type="text/css" />
      
    </head>



    <body>
        <div id="wrapper">	
            <div id="wrapper_top">
                <div id="wrapper_header_1">
                    <div id="hook_header" class="hook">
                        <!-- hook header : widget : hotline, logo, search bar -->

                        <!-- HOTLINE WIDGET -->

                        <div id="hotline_wi" class="hotline_0">
                            <img src="images/hotline_logo.png" alt="hotline_logo" class="hl_align_left"/>
                            <div class="hl_infor">
                                <div class="hl_content">
                                    Call us for reservation
                                </div><!-- End .hl_conent -->
                                <div class="hl_phone_number">
                                    (84)851236536
                                </div><!-- End .hl_phone_number -->
                            </div><!-- End .hl_infor -->
                        </div><!-- End .hotline_0 -->
                        <!-- End HOTLINE WIDGET -->

                        <!-- LOGO WIDGET -->
                        <div id="logo_wi" class="logo_3">

                            <div class="logo_content_wrapper">
                                <div class="logo_content">
                                    <h1 class="company_name">Tiara</h1>
                                    <h3 class="company_description">Restaurant</h3>
                                </div><!-- End .logo_content -->
                            </div><!-- End .logo_content_wrapper -->
                        </div>
                        <!-- End LOGO WIDGET -->

                        <!-- SEARCH BAR WIDGET -->
                        <div id="search_bar_wi" class="search_bar_3">
                            <form class="searchForm" method="post" action="#">
                                <div class="search_bar_wrapper">
                                    <input class="search_text" type="text" name="txtsearch" value="Search keyword here"/>
                                    <input class="search_submit" type="submit" name="btnsearch" value=">"/>
                                </div><!-- End #search_bar_wrapper -->
                            </form>
                        </div><!-- End .search_bar_3 -->
                        <!-- End SEARCH BAR WIDGET -->
                        <style>


                        </style>
                        <!-- HMENU WIDGET -->
                        <div id="hemnu_wi" class="hemnu_4">
                            <div class="hmenu_wrapper">
                                <div class="hemnu_bullet_left"></div>
                                <ul class="hmenu_items">
                                    <li><a href="home.html">Home</a></li>
                                    <li><a href="introduction.html">About us</a></li>
                                    <li><a href="#">Gallery</a></li>
                                    <li><a href="#">Contact</a></li>
                                    <li><a href="#">Blog</a></li>
                                    <li class="last_item current"><a href="news.html">News</a></li>
                                </ul>
                                <div class="hemnu_bullet_right"></div>
                            </div><!--End hmenu_wrapper-->
                        </div>
                        <!-- End HEMNU WIDGET -->

                    </div><!-- End hook_header -->
                </div><!-- End #wrapper_header_1 -->
            </div>
            <!-- End wrapper_top -->

            <!--- Wrapper MAIN --->

            <div id="wrapper_main">
                <div id="hook_breadcrumbs" class="hook">
                    <div id="wrapper_breadcrumbs">
                        <ul>
                            <li>
                                <a href="#">Trang chủ</a>
                            </li>

                            <li>
                                <a href="#">News</a>
                            </li>

                            <li class="current">
                                <a href="#">Fusce euismod consequat ante. Lorem ipsum dolor sit amet.</a>
                            </li>
                        </ul>
                    </div><!-- #wrapper_breadcrumbs -->
                </div>

                <div id="wrapper_news">

                    <div id="wrapper_page_heading">
                        <div id="hook_page_heading" class="hook">

                            <div id="html_heading_wi" class="html_block_2">
                                <h1 class="title">News</h1>
                            </div>
                        </div>
                        <!-- End #hook_page_heading -->
                    </div><!-- End #wrapper_page_heading -->

                    <div id="wrapper_news_1">
                        <div id="hook_news_1" class="hook">

                            <div id="news_detail_2" class="news_detail_2">
                                <style>
                                    .news_detail_2 {
                                        position: relative;
                                    }

                                    .news_detail_2 h1.news_title {
                                        font-family: 'times new roman', sans-serif;
                                        font-size: 12px;
                                        color: #222222;
                                        text-transform: uppercase;
                                        margin-bottom: 10px;
                                    }

                                    .news_detail_2 .post_infor {
                                        font-family: Arial, sans-serif;
                                        font-size: 12px;
                                        color: #535050;
                                        margin-bottom: 25px;
                                    }

                                    .news_detail_2 .post_infor span{
                                        color: #a45298;

                                    }

                                </style>

                                <h1 class="news_title">Fusce euismod consequat ante. Lorem ipsum dolor sit amet.</h1>
                                <div class="post_infor">
                                    by <span class="user_post"> Admin</span> on <span class="date_post"> 13/4/2012</span> with <span class="comment_count"> 0 comment </span>
                                </div>

                                <div class="wrapper_content">
                                    <p>Vestibulum ac dui sit amet ligula blandit vestibulum sit amet dictum justo. Nunc varius interdum odio euismod 
                                        consequat. Aliquam libero justo, dignissim ac eleifend vel, condimentum eget orci. Nam sagittis, odio eu scelerisque 
                                        convallis, ante enim pellentesque dolor, eget rhoncus ligula nulla adipiscing eros. Pellentesque orci sem, venenatis vitae fringilla id, porttitor sed nulla. Aenean id pharetra metus. Pellentesque porta posuere nisl eget malesuada. Etiam congue pretium augue vitae condimentum.

                                        In non nisi sagittis purus malesuada ullamcorper. Maecenas sagittis suscipit elementum. Donec auctor imperdiet urna sed elementum. Sed nec nibh et diam porttitor congue. Curabitur facilisis vestibulum porttitor. Cras aliquam dui sit amet lorem aliquam varius. Etiam imperdiet pharetra quam, a dictum lorem elementum a. Ut vel urna a lectus consequat bibendum sit amet sed lacus. Nunc in felis augue, sed rutrum nisi. Sed semper dui sed velit auctor tincidunt. Pellentesque tincidunt purus sit amet neque vestibulum vel rhoncus nulla laoreet. Proin eros justo, aliquam vel bibendum sit amet, dictum lobortis magna. Etiam bibendum quam at ipsum convallis sed luctus justo dapibus. Vestibulum pulvinar dictum turpis, non posuere elit condimentum eu. Aliquam mollis urna nec lectus elementum vel elementum libero tempus.

                                        Duis malesuada congue magna non interdum. Sed tristique, augue vel sagittis imperdiet, dolor mi tempus metus, et 
                                        venenatis nisl ligula a ipsum. Morbi a justo eros. Sed nibh risus, feugiat quis dignissim at, ornare eget nisi. Donec risus ligula, viverra a feugiat vel, ornare id dui. Sed consequat ultrices neque, at pharetra eros luctus eu. Donec sit amet mi et libero aliquet 
                                        llamcorper. Curabitur sed orci a dui pulvinar iaculis. Etiam ornare, nibh eget egestas euismod, lorem tortor interdum sapien, nec consequat metus elit nec leo. Suspendisse molestie ornare lobortis. Donec hendrerit accumsan tristique.
                                    </p>
                                </div><!-- End #wrapper_content -->

                            </div>
                            <!-- End .news_detail_2 -->

                        </div>
                        <!-- End #hook_news_1 -->

                    </div>
                    <!-- End #wrapper_news_1 -->

                    <div id="wrapper_news_2">
                        <div id="hook_news_sidebar_1" class="hook">
                            <div id="news_filter_11" class="news_filter_11">

                                <h1>Recent posts</h1>
                                <ul>
                                    <li><a href="#">Fusce euismod consequat ante.</a></li>
                                    <li><a href="#">Fusce euismod consequat ante.</a></li>
                                    <li><a href="#">Fusce euismod consequat ante.</a></li>
                                    <li><a href="#">Fusce euismod consequat ante.</a></li>
                                    <li class="active"><a href="#">Fusce euismod consequat ante.</a></li>
                                    <li><a href="#">Fusce euismod consequat ante.</a></li>
                                </ul>
                            </div><!-- End #news_filter_11 -->
                        </div>
                        <!-- End #hook_news_sidebar_1 -->

                        <div id="hook_news_sidebar_2">

                            <div id="vmenu_1" class="vmenu_1">
                                <h1>Categories</h1>
                                <ul>
                                    <li><a href="#"><span>soups</span></a></li>
                                    <li><a href="#"><span>salads</span></a></li>
                                    <li><a href="#"><span>drinks</span></a></li>
                                    <li class="last_item"><a href="#"  class="active"><span>desserts</span></a></li>
                                </ul>
                            </div><!-- End #vmenu_1 -->
                        </div>
                        <!-- End #hook_news_sidebar_2 -->

                        <div id="hook_news_sidebar_3">

                            <div id="vmenu_2" class="vmenu_2">
                                <h1>Archives</h1>
                                <ul>
                                    <li class="active"><a href="#"><span>March 2012</span></a></li>
                                    <li><a href="#"><span>February 2012</span></a></li>
                                    <li><a href="#"><span>January 2012</span></a></li>
                                    <li><a href="#"><span>December 2011</span></a></li>
                                </ul>
                            </div><!-- End #vmenu_2 -->
                        </div>
                        <!-- End #hook_news_sidebar_3 -->
                    </div>
                    <!-- End #wrapper_news_2 -->
                    <div class="clear"></div>

                </div><!-- End #wrapper_news -->
            </div>

            <div id="wrapper_footer">
                <div id="wrapper_footer_section_1">

                    <div id="hook_footer_section_1" class="hook">

                        <div id="html_8" class="html_8">
                            <h1>
                                Tiara
                            </h1>
                            <h3>Restaurant</h3>
                        </div><!-- End .html_8 -->


                        <div id="html_9" class="html_9">

                            <h1>Contact info</h1>
                            <div class="address">8901 Marmora Road, Glasgow, D04 89GR.</div>
                            <ul>
                                <li>Freephone: <span>+1 800 559 6580</span></li>
                                <li>Telephone: <span>+1 800 603 6035</span></li>
                                <li>FAX: <span>+1 800 889 9898</span></li>
                                <li>E-mail: </span>mail@demolink.org</span></li>
                            </ul>


                        </div>
                        <!-- End .html_9 -->

                        <div id="social_8" class="social_8">

                            <h1>Keep in touch</h1>   
                            <ul>
                                <li>
                                    <img src="images/facebook.png" alt="facebook" /> 
                                    <a href="#">Facebook</a>
                                    <div style="clear: both;"></div>
                                </li>

                                <li class="right">
                                    <img src="images/google_plus.png" alt="google_plus" /> 
                                    <a href="#">Google Plus</a>
                                    <div style="clear: both;"></div>
                                </li>

                                <li>
                                    <img src="images/twitter.png" alt="twitter" /> 
                                    <a href="#">Twitter</a>
                                    <div style="clear: both;"></div>
                                </li>

                                <li class="right">
                                    <img src="images/rss.png" alt="rss" /> 
                                    <a href="#">RSS</a>
                                    <div style="clear: both;"></div>
                                </li>

                            </ul>

                        </div>
                        <!-- End .social_8 -->
                    </div>
                    <!-- End #hook_footer_section_1 -->

                </div><!-- End #wrapper_footer_section_1 -->
                <div id="wrapper_footer_section_1_foot"></div>

                <style>
                    #wrapper_footer_section_2 {
                        width: 940px;
                        margin: 0px auto;
                    }
                    #wrapper_footer_section_2 #hook_copyright {
                        height: 30px;
                    }

                    .html_10 {
                        position: absolute;
                        left:0px;
                        top: 0px;
                    }

                    .html_10 p {
                        font-family: Arial, sans-serif;
                        font-size: 11px;
                        color: #5d5d5e;
                    }
                </style>
                <div id="wrapper_footer_section_2">
                    <div id="hook_copyright" class="hook">
                        <div id="html_10" class="html_10">
                            <p>©2012 POWERED BY TIARA™. ALL RIGHT RESERVED.</p>
                        </div>

                    </div>
                </div><!-- End #wrapper_footer_section_2 -->
            </div><!-- End #wrapper_footer -->


        </div><!--END wrapper-->
    </body>
</html>